    <!--- Upload Avatar --->
    <link rel="stylesheet" type="text/css" href="<?php echo css_url().'general_form.css'?>">
    <form class='fill-in-form no-margin' method='post' id="avatar-upload" action="<?php echo site_url().'/user_group2/account/upload_avatar'?>" 
                               enctype="multipart/form-data" target="upload-target" onsubmit='StartUpload();'>
        <ol>
            <div class="head">Profile Picture: </div>
            <li>
            <div class="upload-file" style="cursor:pointer">
                <image id="avatar-image" src="<?php echo $UserInfo['AvatarLink']?>" class="avatar"/>
                <span>Click here to upload your image</span>
            </div>
            <input id="upload-file" class="hidden" type="file" name="avatar" />
            </li>
        </ol>
        <div class="hr" > </div>
    </form>

     <iframe id="upload-target" name="upload-target" src="#" style="width:0;height:0;border:0px solid #fff;"></iframe>
     
     <form id="main-form" action="<?php echo site_url().'/user_group2/account/edit_user_account'?>" method="post">
         <ol>
            <input id='file_url' name='AvatarLink' type='text' value="<?php echo $UserInfo['AvatarLink']?>" style='display:none'/>
            <!-- User Email -->
            <li>
                <div class="head">Email: <?php echo $UserInfo['UserEmail'] ?></div>
            </li>
            <!-- CompanyName -->
            <li>
                <div class="head" >Company Name:</div>
                <div class="tab">
                    <input id="CompanyName" class="text" type="text" name="CompanyName" value="<?php echo $UserInfo['CompanyName'] ?>"/>      
                    <span class='error' id='CompanyName-error'></span>
                </div>      
            </li>
            
            <!-- Change Password -->
            <li>
                <div class = "head">Change Password: <span id="password-error" class="error"></span> </div> 
                <div class="tab margin-bottom">
                    <input id="old-password" class="text" type="password" name="OldPassword" placeholder="Old Password"/>                  
                    <input id="new-password" class="text" type="password" name="NewPassword" placeholder="New Password"/>
                </div>
            </li>
            
            <!-- Describtion -->
            <li>
                <div class="head">Describtion: </div> 
                <div class="tab">
                    <textarea name="Describtion" class="text"><?php echo $UserInfo['Describtion'];?></textarea>
                </div>
            </li>
            
            <li class="margin-top-end">
                <div class="tab">
                    <div id="main-form-submit-btn" class="submit-bt">Save Changes</div>
                </div>
            </li>
         </ol>
         
     </form>
     
     <?php include js_url(true).'validate_things.php'?>
     <script>
         /*----Upload avatar -------*/
         function StopUpload(Result){
            if(Result)
            {
                var i = new Date().getTime();
                $("#avatar-image").attr("src","<?php echo image_url()?>"+Result+"?random="+i);
                $("div.upload-file span").text("Successfully uploaded");
                $("input#file_url").val("<?php echo image_url()?>"+Result);
            }
           else{
               $("div.upload-file span").text("The uploading has been failed. Please try again");
           }
        }

        function StartUpload(){
            $("div.upload-file span").text("Uploading....");
        }
        
        /* Upload file btn click */
        $("div.upload-file").on('click',function(){
            $("input#upload-file").click();
        });

        $("input#upload-file").on('change',function(){
            if(!checkFileName($(this).val()))
            {
                $("div.upload-file span").text("Wrong type of file. Only JPG, JPEG, PNG and BMP is allowed");
                return;
            }
            $("form#avatar-upload").submit();
        });
        /*---End of upload avatar---*/
        /*-----Validate name ----------*/
        var validate_name = function(){
            var isPass = true;
            value = $("#CompanyName").val();
            if(value.length == 0){
                $("#CompanyName-error").text("Name is required");
                $("#CompanyName").attr("class","text-error");
                isPass = false;
            }
            else{
                $("#CompanyName-error").text("");
                $("#CompanyName").attr("class","text");
            }
            return isPass;
        }
        $("#CompanyName").on("change",validate_name);
        /*---Validate Password ---*/
        var validate_password = function(){
            oldPass = $("#old-password").val();
            oldPass = md5(oldPass).toString().trim();
            newPass = $("#new-password").val();
            Pass = "<?php echo $UserInfo['UserPassword']?>";
            havingOldPass =false;
            if(oldPass != Pass && oldPass.length > 0){
                $("#old-password").attr("class","text-error");
                $("#password-error").text("Your old password is incorrect.");           
                return false;
            }
            else if(oldPass.length > 0){
                havingOldPass = true;
                $("#old-password").attr("class","text");
                $("#password-error").text("");
            }
            if (IsPasswordValid(newPass) == false && (newPass.length > 0 || havingOldPass)){
                $("#new-password").attr("class","text-error");
                $("#password-error").text("Your new password must be: 6-20 characters, 1 upper, 1 lower, 1 digit");
                return false;
            }
            else{
                $("#new-password").attr("class","text");
                $("#password-error").text("");             
            }
            return true;
        }
        /*----End of validate password ---*/
        $("#main-form-submit-btn").on('click',function(){
            isPass = true;
            if(!validate_name()) isPass = false;
            if(!validate_password()) isPass = false;
            if(isPass)
                $("#main-form").submit();
        });
    </script>